<form name = "myform">
<input type = "text" name = "textbox" id="textbox1" onblur = "update()"><br>
<input type = "text" name = "textbox" id="textbox2"onblur = "update()"><br>
<input type = "text" name = "textbox" id="textbox3" onblur = "update()"><br><br>
You have filled in <input type = "text" name = "count" value = "0" size = "2" style="background-color:yellow" readonly> textboxes
</form>

<script type = "text/javascript">
function update() {
var counter = 0;
var a = document.myform.textbox1.value;
var b = document.myform.textbox2.value;
var c = document.myform.textbox3.value;
a = a.replace(/^\s+|\s+$/g,""); // strip leading and trailing spaces
b = b.replace(/^\s+|\s+$/g,""); // strip leading and trailing spaces
c = c.replace(/^\s+|\s+$/g,""); // strip leading and trailing spaces
if (a !="") {counter ++}
if (b !="") {counter ++}
if (c !="") {counter ++}
document.myform.count.value = counter;
}

</script>